---
layout: example
categories: example/v1.0.0
version: v1.0.0
title: Using maxBounds to restrict map panning
description: Preventing users from leaving an area on the map
tags:
  - ui
---
<div id='map'></div>

<script>
// Construct a bounding box for this map that the user cannot
// move out of
var southWest = L.latLng(40.712, -74.227),
    northEast = L.latLng(40.774, -74.125),
    bounds = L.latLngBounds(southWest, northEast);

var map = L.mapbox.map('map', 'mapbox.streets', {
    // set that bounding box as maxBounds to restrict moving the map
    // see full maxBounds documentation:
    // http://leafletjs.com/reference.html#map-maxbounds
    maxBounds: bounds,
    maxZoom: 19,
    minZoom: 10
});

// zoom the map to that bounding box
map.fitBounds(bounds);
</script>
